<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>获取订阅地址</title>
<meta name="viewport" content="width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no;" />
<link href="resource/jquery.mobile-1.4.2.min.css" rel="stylesheet" type="text/css"/>
<script src="resource/jquery-2.1.0.min.js" type="text/javascript"></script>
<script src="resource/jquery.mobile-1.4.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(e) {
	$("#button").bind("click", function(){ check_form(); });
});

// 表单提交
function check_form(){
	$.ajax({
		url:"subscribe_cityid.php",
		type:"POST",
		async:true,
		cache:false,
		data:$("#search_cityid").serialize(),
		dataType: "json",
		success: function(data){
			if(data.status=="error"){
				alert(data.msg);
			}else{
				$("#url").val(data.msg);
				window.location.href="#pagetwo";
			}
		},
		error: function(XMLHttpRequest, textStatus, errorThrown){
			alert("提交失败！");
		}
	});
}

</script>
</head>
<body>

<div data-role="page" id="pageone">
  <div data-role="content">
    <form method="post" id="search_cityid" action="#">
      <label for="city">城市:</label>
      <input type="text" name="city" id="city" placeholder="输入城市名，纯农历不需要输入 ...">
      <fieldset data-role="controlgroup">
        <legend>请选择您喜爱的样式：</legend>
        <label for="s1">全部显示-农历前3天到后7天</label>
        <input type="radio" name="s" id="s1" value="1" checked>
        <label for="s2">仅天气，不显示农历</label>
        <input type="radio" name="s" id="s2" value="2">
        <label for="s3">全部显示-农历前7天到后30天</label>
        <input type="radio" name="s" id="s3" value="3">
        <label for="s4">全部显示-农历前7天到后60天</label>
        <input type="radio" name="s" id="s4" value="4">
        <label for="s5">全部显示-农历前30天到后90天</label>
        <input type="radio" name="s" id="s5" value="5">
        <label for="s6">纯农历-农历前7天到后30天</label>
        <input type="radio" name="s" id="s6" value="6">
        <label for="s7">纯农历-农历前7天到后60天</label>
        <input type="radio" name="s" id="s7" value="7">
        <label for="s8">纯农历-农历前30天到后90天</label>
        <input type="radio" name="s" id="s8" value="8">
        <label for="s9">纯农历-农历前30天到后180天</label>
        <input type="radio" name="s" id="s9" value="9">
        <label for="s10">纯农历-农历前30天到后360天</label>
        <input type="radio" name="s" id="s10" value="10">
      </fieldset>
      <input type="button" id="button" data-inline="true" value="提交">
    </form>
  </div>
</div>

<div data-role="page" id="pagetwo">
  <div data-role="content">
    <h2>您选择的城市订阅地址为：</h2>
    <br />
    <input type="text" name="url" id="url">
    <br /><br />
    <a href="#" data-role="button" data-rel="back">重新查询</a>
  </div>
</div>

</body>
</html>